<template>
    <h2>新增门店信息</h2>
    <table>
        <tr>
            <td>门店名称</td>
            <td>
                <input type="text" placeholder="请输入门店名称" v-model="shop.shop_Name"/>
            </td>
        </tr>
        <tr>
            <td>服务范围</td>
            <td>
                <select  v-model="shop.shop_Server">
                    <option value="">--请选择--</option>
                    <option value="早餐早点">早餐早点</option>
                    <option value="川菜">川菜</option>
                    <option value="湘菜">湘菜</option>
                    <option value="粤菜">粤菜</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>门店Logo</td>
            <td>
                <img :src="shop.shop_Logo" style="width: 80px;height: 80px;"/>
                <input type="file" @change="UpLogo" />
            </td>
        </tr>
        <tr>
            <td>门店图片</td>
            <td>
                <img :src="shop.shop_Img" style="width: 80px;height: 80px;"/>
                <input type="file" @change="UpImg"  />
            </td>
        </tr>
        <tr>
            <td>
                <input type="button" class="btn btn-success" value="添加" @click="AddShop" />
            </td>
        </tr>
    </table>

</template>
<script setup lang="ts">
import axios from 'axios';
import { ref } from 'vue';
import { useRouter } from 'vue-router';

const router=useRouter();

//上传logo
const UpLogo=(e:any)=>{
    var file=e.target.files[0];
    var fd=new FormData();
    fd.append("img",file);
    axios.post("https://localhost:7283/api/UpLoadFiles/UpFile",fd)
    .then(res=>{
        if(res.data.code==-1){
            alert(res.data.msg)
            return
        }
        if(res.data.code==-2){
            alert(res.data.msg)
            return
        }
        if(res.data.code==1){
            alert(res.data.msg)
            shop.value.shop_Logo=res.data.fPath
        }
    })
    .catch(error=>{
        alert(error)
    })
}
//上传图片
const UpImg=(a:any)=>{
    var file=a.target.files[0];
    var fd=new FormData();
    fd.append("img",file);
    axios.post("https://localhost:7283/api/UpLoadFiles/UpFile",fd)
    .then(res=>{
        if(res.data.code==-1){
            alert(res.data.msg)
            return
        }
        if(res.data.code==-2){
            alert(res.data.msg)
            return
        }
        if(res.data.code==1){
            alert(res.data.msg)
            shop.value.shop_Img=res.data.fPath
        }
    })
    .catch(error=>{
        alert(error)
    })
}


//创建响应式数据用于完成添加
const shop=ref({
  "shop_Id": 0,
  "shop_Name": "",
  "shop_Server": "",
  "shop_Logo": "",
  "shop_Img": "",
  "shop_Starte": true,
  "shop_Isdelete": false
})

//添加
const AddShop=()=>{
    //验证
    if(shop.value.shop_Name==""){
        alert("门店名称不能为空")
        return;
    }
    if(shop.value.shop_Server==""){
        alert("请选择服务范围")
        return;
    }
    if(shop.value.shop_Logo==""){
        alert("请上传门店logo")
        return;
    }
    if(shop.value.shop_Img==""){
        alert("请上传门店图片")
        return;
    }
    axios.post("https://localhost:7283/api/Shop/AddShop",shop.value)
    .then(res=>{
        if(res.data>0){
            alert('添加成功')
            router.push("/ShowShop")
        }else{
            alert('添加失败')
        }
    })
    .catch(error=>{
        alert(error)
    })
}






</script>